<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/view/include/taglib.jsp"%>
<html lang="cn" class="app">
<head>
    <title>后台管理 - 行政区划字典表</title>
    <meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="icon" type="image/png" href="icon.png">
    <link rel="apple-touch-icon-precomposed" href="icon.png">
    <link rel="stylesheet" href="${ctxStatic}/js/jPlayer/jplayer.flat.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/bootstrap.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/animate.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/font-awesome.min.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/simple-line-icons.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/font.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/app.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/js/ztree/css/zTreeStyle.css" />
    <!--[if lt IE 9]>
    <script src="${ctxStatic}/js/ie/html5shiv.js"></script>
    <script src="${ctxStatic}/js/ie/respond.min.js"></script>
    <script src="${ctxStatic}/js/ie/excanvas.js"></script>
    <![endif]-->
</head>
<body>

<section class="scrollable wrapper">
    <div class="row">
        <div class="col-lg-12">
            <!-- 引导开始 -->
            <ul class="breadcrumb">
                <li><a href="${ctx}/welcome"><i class="fa fa-home"></i> 主页</a></li>
                <li>系统管理</li>
                <li class="active">行政区划管理</li>
            </ul>
            <!-- 引导结束 -->
        </div>
    </div>

    <div class="col-sm-3" style="overflow: auto">
        <style>.line{height:auto;}</style><%--这个不能删除--%>
        <ul id="tree" class="ztree" style="min-width: 300px;"></ul><!-- 资源树 -->
    </div>

    <div class="col-sm-9">
        <section class="panel panel-default">
        <%--操作区域 开始--%>
        <div class="row wrapper">
            <div class="col-sm-5 m-b-xs">
                <shiro:hasPermission name="dic:dicRegion:create">
                    <button class="btn btn-sm btn-default" onclick="openModel(false,'${ctx}/dic/dicRegion/create')">新增</button>
                </shiro:hasPermission>
                <shiro:hasPermission name="dic:dicRegion:cache">
                <button class="btn btn-sm btn-info" onclick="refreshRegionCache();">刷新缓存</button>
                </shiro:hasPermission>
                <button class="btn btn-sm btn-dark" onclick="showTip(this)">如何使用城市缓存</button>
            </div>
            <div class="col-sm-4 m-b-xs">

            </div>
            <%--搜索区域--%>
            <div class="col-sm-3">
                <%--<div class="input-group">--%>
                    <%--<input id="searchKey" type="text" class="input-sm form-control" placeholder="输入关键字">--%>
                    <%--<span class="input-group-btn">--%>
                        <%--<button onclick="searchPage(1,0);" class="btn btn-sm btn-default" type="button">搜索</button>--%>
                    <%--</span>--%>
                <%--</div>--%>
            </div>
        </div>
        <%--操作区域 结束--%>

        <div class="table-responsive">
            <table class="table table-striped b-t b-light">
                <thead>
                <tr>
                    <th class="text-center" style="width:70px;">序号</th>
                    <th class="text-center">行政区划代码</th>
                    <th class="text-center">行政区划名称</th>
                    <%--<th class="text-center">级别</th>--%>
                    <%--<th class="text-center">行政区划图片</th>--%>
                    <%--<th class="text-center">创建人</th>--%>
                    <%--<th class="text-center">创建时间</th>--%>
                    <%--<th class="text-center">更新人</th>--%>
                    <%--<th class="text-center">更新时间</th>--%>
                    <%--<th class="text-center">备注</th>--%>
                    <%--<th class="text-center">状态</th>--%>
                    <th class="text-center" width="">操作</th>
                </tr>
                </thead>
                <tbody id="tplView">

                </tbody>
            </table>
        </div>

        <footer class="panel-footer">
            <div class="row">
                <%--分页--%>
                <div id="page" class="col-sm-12 text-right text-center-xs"></div>
            </div>

        </footer>

        </section>
    </div>

</section>


</body>
<script src="${ctxStatic}/js/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="${ctxStatic}/js/bootstrap.js"></script>
<!-- App -->
<script src="${ctxStatic}/js/app.js"></script>
<script src="${ctxStatic}/js/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${ctxStatic}/js/app.plugin.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/jquery.jplayer.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/add-on/jplayer.playlist.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/demo.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/tools.js?version=${ctxVersion}"></script>
<script type="text/javascript" src="${ctxStatic}/js/page/paging.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/layer/layer.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/tmpl/jquery.tmpl.js"></script>
<script src="${ctxStatic}/js/ztree/js/jquery.ztree.core-3.5.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/table2excel/jquery.table2excel.js"></script>
<script id="tplHtml" type="text/x-jquery-tmpl">
    {{if results && results.length>0 }}
        {{each results}}
        <tr>
            <td class="text-center" >{{= ($index+1)+(pageNo-1)*10}}</td>
            <td class="text-center">{{= regionCd}}</td>
            <td class="text-center">{{= regionNm}}</td>
            <%--<td class="text-center">{{= level}}</td>--%>
            <%--<td class="text-center">{{= regionPic}}</td>--%>
            <%--<td class="text-center">{{= createBy}}</td>--%>
            <%--<td class="text-center">{{= createDateStr}}</td>--%>
            <%--<td class="text-center">{{= updateBy}}</td>--%>
            <%--<td class="text-center">{{= updateDateStr}}</td>--%>
            <%--<td class="text-center">{{= remarks}}</td>--%>
            <%--<td class="text-center" >{{if status=="0"}}<span class="label label-success">有效</span>{{else}}<span class="label label-danger">无效</span>{{/if}}</td>--%>
            <td class="text-center">
                <div class="btn-group">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-pencil"></i></a>
                    <ul class="dropdown-menu pull-right" style="min-width: 60px;">
                        <shiro:hasPermission name="dic:dicRegion:update">
                        <li><a href="javascript:;" onclick="openModel('','${ctx}/dic/dicRegion/update?id={{= id }}',true,true)">编辑</a></li>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="dic:dicRegion:delete">
                        <li><a href="${ctx}/dic/dicRegion/delete?id={{= id }}&pageNo={{= pageNo}}&pageSize={{= pageSize}}" onclick="return confirm('确认要删除该条数据吗？', this.href)" title="删除">删除</a></li>
                        </shiro:hasPermission>
                    </ul>
                </div>
            </td>
        </tr>
        {{/each}}
    {{else}}
        <tr><td colspan="5" class="text-center" >暂无数据</td></tr>
    {{/if}}
</script>
<script>
    $(function(){
        var msg = '${msg}';
        if(msg!=''){
            showMsg(msg);
        }

        searchPage(1,0);

        var setting = {
            data: {
                simpleData: {
                    enable: true
                }
            },
            callback : {
                onClick : function(event, treeId, treeNode) {
                    <%--location.href = "${ctx}/organization?id="+treeNode.id;--%>
                    searchPage(1,treeNode.id);
                }
            }
        };
        var zNodes =[
            <c:forEach items="${regionList}" var="o" varStatus="status">
            { id:"${o.id}", pId:"${o.parentId}", name:"${o.regionNm}", open:0}<c:if test="${!status.last}">,</c:if>
            </c:forEach>
        ];
        $(document).ready(function(){
            var ztree = $.fn.zTree.init($("#tree"), setting, zNodes);
//            ztree.expandAll(true);
        });
    })
    //查询分页数据
    function searchPage(num,parentId){
        var label = $("#searchKey").val();
        var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
        $.ajax({
            type: 'post',
            url: '${ctx}/dic/dicRegion/getPage.json?timeStamp='+new Date().getTime(),
            dataType:"json",
            data: {"pageNo":num,"pageSize":$("#paging_js_page_size").val(),"parentId":parentId},
            success: function (data) {
                layer.close(loadingLayer);
                var page = data.data;
                $( "#tplView" ).empty();
                $( "#tplHtml" ).tmpl( data.data ).appendTo( "#tplView" );

                //分页
                $("#page").paging({
                    pageNo:page.pageNo,
                    totalPage: page.totalPage,
                    totalSize: page.totalRecord,
                    callback: function(num) {
                        searchPage(num,parentId);
                    }
                })

            },error:function(){
                layer.close(loadingLayer);
                showMsg("点击过快或程序异常");
            }
        });
    }
    /**刷新缓存*/
    function refreshRegionCache(){
        var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
        $.ajax({
            type: 'post',
            url: '${ctx}/dic/dicRegion/refreshCache.json?timeStamp='+new Date().getTime(),
            dataType:"json",
            data: {},
            success: function (data) {
                layer.close(loadingLayer);
                if(data.ret = 1){
                    showMsg(data.desc);
                }else{
                    alert("程序出错");
                }
            },error:function(){
                layer.close(loadingLayer);
                showMsg("点击过快或程序异常");
            }
        });
    }
    /**提示如何使用*/
    function showTip(dom) {
        var content = "<div style=\"font-size:14px;color:#fff;padding:5px 10px 5px 20px;\">" +
            "使用方法：<br/> " +
            "引入：【com.raising.modules.dic.utils.RegionUtil】 <br/><br/> " +
            "<span style=\"font-weight: bold\">1、获取所有城市（根据级别查询当前级别城市）：</span><br/> " +
            "&nbsp;&nbsp;List<DicRegion> getAllRegionList(String level)<br/>" +
            "&nbsp;&nbsp;level：指定级别，为null查所有<br/><br/>" +
            "<span style=\"font-weight: bold\">2、根据cd或id查询下级城市：</span><br/>" +
            "&nbsp;&nbsp;List<DicRegion> getRegionChildByCd(String regionCd)<br/>" +
            "&nbsp;&nbsp;regionCd 选择的目标城市id或cd<br/>" +
            "</div>";

        //小tips
        layer.tips(content, $(dom), {
            tips: [1, '#3595CC'],
            area: ['500px', '350px'],
            time: 0,
            closeBtn: 1,
            shadeClose: true
        });

    }
</script>
</html>
